<template>
	<view class="page-container nannie-detail-container">
		<!-- 阿姨信息 -->
		<view class="nannie-info-box">
			<view class="nannie-info-box-bg">
				<image class="" :src="$img_path('/home/needs/nannie-bg.png')" mode="widthFix"></image>
			</view>
			<view class="nannie-info-content">
				<view class="nannie-image">
					<image :src="$img_base_url(info.tx_image)" mode="aspectFill"></image>
				</view>
				<view class="nannie-info">
					<view class="nickname">
						<text>{{info.name}}</text>
					</view>
					<view class="tip">
						<text>{{info.sex}} | {{$dayjs().diff(info.cs_time,'years')}}岁 | {{$dayjs().diff(info.work_time,'years')}}年工作经验 | 属{{info.sx}} | {{info.xz}}</text>
					</view>
				</view>
			</view>
		</view>
		<!-- 标签 -->
		<view class="nannie-tag-box">
			<view class="display-flex alig space-between">
				<view class="nannie-tag">
					<view class="icon">
						<image class="" :src="$img_path('/home/needs/icon-1.png')" mode="widthFix"></image>
					</view>
					<text>标签标签标签标签</text>
				</view>
				<view class="nannie-tag">
					<view class="icon">
						<image class="" :src="$img_path('/home/needs/icon-1.png')" mode="widthFix"></image>
					</view>
					<text>标签标签标签标签</text>
				</view>
			</view>
			<view class="display-flex alig space-between" style="margin-top: 30rpx;">
				<view class="nannie-tag">
					<view class="icon">
						<image class="" :src="$img_path('/home/needs/icon-1.png')" mode="widthFix"></image>
					</view>
					<text>标签标签标签标签</text>
				</view>
				<view class="nannie-tag">
					<view class="icon">
						<image class="" :src="$img_path('/home/needs/icon-1.png')" mode="widthFix"></image>
					</view>
					<text>标签标签标签标签</text>
				</view>
			</view>
		</view>
		<view class="card-box-1 mt-20 qz-box">
			<view class="title">
				<text>求职意向</text>
			</view>
			<view class="mt-20">
				<text>工作职位：护工、护理员</text>
			</view>
			<view class="mt-20">
				<text>住家情况：{{info.zjqk==1 ? '住家' : info.zjqk==0 ? '均可' : '不住'}}</text>
			</view>
		</view>
		<view class="card-box-1 mt-20 zw-box">
			<view class="title">
				<text>自我介绍</text>
			</view>
			<view class="mt-20 content">
				<text>{{info.js}}</text>
			</view>
			<view class="sub-title mt-20">
				<view class="icon">
					<image :src="$img_path('/home/needs/icon-like.png')" mode="widthFix"></image>
				</view>
				<text>擅长技能：</text>
			</view>
			<view class="mt-20 content">
				<text>{{info.scjn}}</text>
			</view>
		</view>
		<view class="margin-top-40">
			<view class="title">
				<text>认证证书</text>
			</view>
			<view class="zs-image mt-20" @click="previewImages($img_base_url(info.rz_image))">
				<lazy-image :src="$img_base_url(info.rz_image)"></lazy-image>
			</view>
		</view>
		<view class="mt-20 card-box-2 ss-box display-flex alig space-between">
			<view class="left">
				<view class="title">
					<text>生活照</text>
				</view>
				<view class="mt-20">
					<text>个人风采生活照</text>
				</view>
				<view class="margin-top-10">
					<text>{{info.shz_images.split(',').length}}张</text>
				</view>
			</view>
			<view class="right display-flex alig">
				<view class="image" v-for="(item, index) in zs_imgs" :key="index" @click="previewImages(info.shz_images)">
					<lazy-image :src="$img_base_url(item)"></lazy-image>
				</view>
			</view>
		</view>
		<view class="mt-20 card-box-2 gz-box" v-for="(item,i) in info.work" :key="i">
			<view class="title">
				<text>工作经历</text>
			</view>
			<view class="time mt-20">
				<text>· {{$dayjs.unix(item.start_time).format('YYYY-MM-DD')}}-{{$dayjs.unix(item.end_time).format('YYYY-MM-DD')}}</text>
			</view>
			<view class="content mt-20">
				<text>{{item.desc}}</text>
			</view>
		</view>
		<!-- 固定按钮 -->
		<view class="fixed-box">
			<view class="fixed-btn common-btn-bg-color" v-if="info.is_js==1">
				<text>立即咨询</text>
			</view>
			<view class="fixed-btn common-btn-bg-color" v-else>
				<text>解锁联系阿姨</text>
			</view>
		</view>
	</view>
</template>

<script>
	import { BmDetail } from '@/utils/api/serviceApi.js'
	export default {
		data() {
			return {
				id:0,
				info:{},
				zs_imgs:[]
			}
		},
		onLoad(options) {
			this.id = options.id
			this.getDetail()
		},
		methods: {
			getDetail(){
				uni.showLoading({
					title:'加载中...'
				})
				BmDetail({id:this.id}).then(res=>{
					uni.hideLoading()
					this.info = res.data
					this.zs_imgs = res.data.shz_images.split(',').slice(0,2)
				})
			},
			
			// 预览图片
			previewImages(urls, current = 0) {
				let imgs = urls.split(',')
				let arr = []
				imgs.forEach(e=>{
					arr.push(this.$img_base_url(e))
				})
				console.log("urls", arr)
				uni.previewImage({
					urls: arr,
					current: current
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	@import "nannieDetail.scss"
</style>